<!DOCTYPE html>
<html lang="en">
<head>
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0">
    <meta charset="UTF-8">
    <title>红旅动画片</title>
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="css/mui.min.css">
    <link href="lib/css/bootstrap.min.css" rel="stylesheet">
    <script src="js/template-native.js"></script>
    <script src="js/jquery-3.0.0.min.js"></script>
    <script src="js/index.js"></script>
</head>
<body>
<div class="container">
    <!--导航头-->
    <div class="head">
        <a href="#" class="search"></a>
        <a id="search" class="mui-icon mui-icon-search"></a>
        <h1>红旅动漫</h1>
    </div>
    <!--轮播图-->
    <div class="lunbo">
        <ul class="index_banner_ul clearfix">
            <!---->
        </ul>
    </div>
    <!--tab栏-->
    <div class="tab">
        <a class=" active" href="#item1">
            新增连载
        </a>
        <a class="" href="#item2">
            新增完结
        </a>
        <a class="" href="#item3">
            推荐连载
        </a>
        <a class="" href="#item4">
            推荐完结
        </a>
    </div>
    <div>
    <ul class="tab1"></ul>


    </div>

</div>
</body>
</html>
<script type="text/template" id='template'>
    <% for(var i=0;i<array.length; i++) {%>
    <li>
        <img src="<%=array[i].img%>">
        <span><%=array[i].title%></span>
    </li>
    <% }%>
</script>

<script id="template1" type="text/template">
    <% for(var i=0;i<array.length;i++) {%>
    <li><a href="<%=array[i].url%>">
        <img src="<%=array[i].img%>" alt="">
        <p><%=array[i].name%></p>
        <div class="cover"><%=array[i].update%></div>
    </a></li>
    <% }%>
</script>
<script>
    $(function () {
        $.ajax({
            type: "get",
            url: "http://127.0.0.1:9090/api/getlunbo",
            data: "json",
            success: function (data) {
//                console.log(data);
                var html = template("template", {array: data});
                $(".index_banner_ul").html(html);
            }
        })
    })
</script>
<script>
    $(function () {
        $(".tab a").click(function () {
            $(this)
                    .addClass("active")
                    .siblings()
                    .removeClass("active");
            var RTindex = $(this).index() + 1;
            getTabInfo(RTindex);
        })


        $.ajax({
            type: "get",
            url: "http://127.0.0.1:9090/api/gethometab/" + 1,
            data: "json",
            success: function (data) {
//                    console.log(data);
                var html = template("template1", {array: data});
                $(".tab1").html(html);
//
            }
        })
        function getTabInfo(type) {
            $.ajax({
                type: "get",
                url: "http://127.0.0.1:9090/api/gethometab/" + type,
                data: "json",
                success: function (data) {
//                    console.log(data);
                    var html = template("template1", {array: data});
                    $(".tab1").html(html);
//                    console.log( $(".index_banner_ul"));
                }
            })
        }
//
//
    })
</script>
